.MobileTab {
  @media @tablet-up {
    display: none;
  }

  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background: @body-bg;
  box-shadow: 0 2px 6px @shadow-color;
  z-index: @zindex-header;

  &-items {
    display: flex;
    justify-content: space-between;
    align-items: center;
    list-style: none;
    height: 100%;

    margin: 0 auto;
    padding: 0 0 env(safe-area-inset-bottom, 0);
    text-align: center;

    li {
      flex-basis: 100%;
      min-width: 54px;
      margin: 0 3px;
    }

    a,
    > li > .Button,
    > li > .Dropdown {
      color: @header-control-color;
      display: block;
      width: 100%;
      -webkit-tap-highlight-color: fade(@control-bg, 60%);
      padding: 10px 10px 5px 10px;
      text-align: center;
    }

    > li > a {
      &:hover {
        text-decoration: none;
      }
    }

    // Style buttons but not buttons in dropdowns
    > li > .Button > .Button,
    > li > a > .Button,
    > li > .Dropdown > .Button > .Button {
      padding: 0;
      margin: 0;
      color: @header-control-color;
      background: transparent;

      &-icon {
        margin-right: 0;
        margin-bottom: 6px;
        font-size: 20px;
      }

      &-label {
        display: block;
        font-size: 9px;
        line-height: 1em;
        margin: 0 !important;
      }
    }

    > li > .ButtonGroup.Dropdown {
      padding: 0;
    }

    > li > .ButtonGroup.Dropdown > .Button {
      float: none;
      width: 100%;
      padding: 10px 10px 5px 10px;

      &:focus,
      &:active {
        background: transparent;
        box-shadow: none;
      }
    }

    .item-logIn {
      color: @header-control-color;
    }

    .item-session {
      > .Dropdown > .Button {
        padding: 0;
      }

      .Button:hover,
      .Button:active {
        background: transparent;
      }
    }

    .SessionDropdown {
      .Avatar {
        margin: 0 0 4px;
        border: 1px solid @control-bg;
      }
    }

    a[active='true'] {
      color: @primary-color;
    }

    .item-notifications .Button-label {
      position: relative;
    }

    .NotificationsDropdown-unread {
      top: -28px;
      left: 50% !important;
    }
  }
}
